<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div id="app">
        <h3>Vue中获取事件对象</h3>
        <a href="http://baidu.com" @click="goBaidu">去百度</a>
        <a href="http://jd.com" @click="goJd($event,'小喵', '买猫粮')">去京东</a>
    </div>
    <script src="./js/vue.js"></script>
    <script>


        const vm = new Vue({
            el:'#app',
            data(){
                return {
                    money:666
                }
            },
            methods: {
                // 1. 如果html中的方法没有传参，直接在方法里写e来接收事件对象
                goBaidu(e){
                    // 想要点击的时候不跳转
                    e.preventDefault()
                    console.log('去百度')
                },
                // 2. 如果传了参数，通过$event来代表事件对象，$event写在方法参数中
                // $event位置可以交换，如果放在第一位，获取的时候，第一个参数就是e
                goJd(e, a, b){
                    e.preventDefault()
                    console.log(a, b)
                    console.log('去京东')
                }
            }
        })
        // v-bind  ==> : 
        // v-on    ==> @
    </script>
</body>
</html>